<template>
	<div class="developer">
		<el-row><br></el-row>
		<el-row style="color: #FFFFFF;" gutter="100">
			<el-col :offset="2" class="developer_info" span="4"
			style="background-color: #696969; padding: 20px;">
				<el-row>基本信息</el-row>
				<el-divider></el-divider>
				<el-row>开发者名：{{developer_name}}</el-row>
				<br />
				<el-row>注册邮箱：{{email}}</el-row>
			</el-col>
			<el-col span="14">
				<el-table
				:data="game_data"
				:header-cell-style="{background:'#696969',borderColor:'#CECECE',textAlign:'center'}"
				:cell-style="{background:'#696969',borderColor:'#CECECE',textAlign:'center', color:'#FFFFFF'}">
					<el-table-column label="开发游戏列表">
						<template slot-scope="scope">
							<img :src="scope.row.img" height="90" width="160">
						</template>
					</el-table-column>
					<el-table-column prop="name"></el-table-column>
					<el-table-column prop="status" label="状态">
						<template slot-scope="scope">
							<div v-if="scope.row.status == 1">
								<el-tag type="success">已发布</el-tag>
							</div>
							<div v-else>
								<el-tag>测试中</el-tag>
							</div>
						</template>
					</el-table-column>
					<el-table-column>
						<template slot-scope="scope">
							<el-tooltip class="item" effect="dark" content="相关信息" placement="left">
								<el-button @click="
								game_detail = true;
								game_detail_name = scope.row.name;
								game_detail_condition = scope.row.status;"
								icon="el-icon-s-data" circle></el-button>
							</el-tooltip>
						</template>
					</el-table-column>
					<el-table-column>
						<template slot-scope="scope">
							
							<el-tooltip class="item" effect="dark" content="更改游戏设置" placement="right">
								<el-button @click="
								set_game = true; 
								set_game_name = scope.row.name;" 
								icon="el-icon-setting" circle></el-button>
							</el-tooltip>
							
						</template>
					</el-table-column>
				</el-table>
			</el-col>
			<el-col span="2">
				<el-tooltip class="item" effect="dark" content="新建游戏" placement="bottom">
					<el-button @click="add_game = true;" icon="el-icon-plus" circle></el-button>
				</el-tooltip>
			</el-col>
		</el-row>
		<el-drawer
		title="添加游戏"
		:visible.sync="add_game"
		:direction="add_game_direction"
		:before-close="handleClose">
		<div style="padding: 10px;">
			游戏名称：
			<el-input v-model="new_game_name" placeholder=""></el-input>
			<el-row><br></el-row>
			游戏介绍：
			<el-input
				type="textarea"
				:rows="2"
				placeholder=""
				v-model="new_game_intro">
			</el-input>
			<el-row><br></el-row>
			游戏定价：
			<el-input v-model="new_game_price" placeholder=""></el-input>
			<el-row><br></el-row>
			游戏版本：
			<el-input v-model="new_game_ver" placeholder="1.0"></el-input>
			<el-row><br></el-row>
			展示图片：
			<el-button icon="el-icon-picture" circle></el-button>
			<el-row><br></el-row>
			上传游戏：
			<el-button icon="el-icon-upload" circle></el-button>
			
		</div>
		</el-drawer>
		<el-drawer
		title="更改游戏"
		:visible.sync="set_game"
		:direction="set_game_direction"
		:before-close="handleClose"
		style="overflow: scroll;">
		<div style="padding: 10px; color: #000000;">
		
			更改游戏名称：
			<el-input v-model="set_game_name" placeholder=""></el-input>
			<el-row><br></el-row>
			更改游戏介绍：
			<el-input
				type="textarea"
				:rows="2"
				placeholder=""
				v-model="set_game_intro">
			</el-input>
			<el-row><br></el-row>
			更改游戏定价：
			<el-input v-model="set_game_price" placeholder=""></el-input>
			<el-row><br></el-row>
			是否开启折扣：
			<el-switch v-model="set_game_isdiscount" active-text="开启" inactive-text="关闭" @change="isdiscount"></el-switch>
			<el-row><br></el-row>
			设置游戏折扣：
			<el-input v-model="set_game_discount" :disabled="set_game_isdis"></el-input>
			<el-row><br></el-row>
			设置折扣开启时间：
			<el-date-picker
				v-model="discount_begin"
				type="date"
				placeholder="选择日期"
				:disabled="set_game_isdis">
			</el-date-picker>
			<el-row><br></el-row>
			设置折扣关闭时间：
			<el-date-picker
				v-model="discount_end"
				type="date"
				placeholder="选择日期"
				:disabled="set_game_isdis">
			</el-date-picker>
			<el-row><br></el-row>
			游戏版本：
			<el-input v-model="set_game_ver" placeholder="1.0"></el-input>
			<el-row><br></el-row>
			更改展示图片：
			<el-button icon="el-icon-picture" circle></el-button>
			<el-row><br></el-row>
			上传游戏：
			<el-button icon="el-icon-upload" circle></el-button>
			<el-row><br></el-row>
			删除游戏：
			<el-button icon="el-icon-close" circle></el-button>
		</div>
		</el-drawer>
		<el-drawer
		title="游戏详情"
		:visible.sync="game_detail"
		:direction="game_detail_direction"
		:before-close="handleClose">
		<div style="padding: 10px; color: #000000;">
			游戏名称：{{game_detail_name}}
			<el-row><br></el-row>
			游戏ID：{{game_detail_ID}}
			<el-row><br></el-row>
			游戏状态：{{game_detail_condition}}
			<el-row><br></el-row>
			最新版本：{{game_detail_version}}
			<el-row><br></el-row>
			发布日期：{{game_detail_date}}
			<el-row><br></el-row>
			定价：{{game_detail_price}}
			<el-row><br></el-row>
			购买量：{{game_detail_num_buy}}
			<el-row><br></el-row>
			下载量：{{game_detail_num_down}}
			<el-row><br></el-row>
		</div>
		</el-drawer>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				developer_name: "coco",
				email: "123",
				game_data: [
					{
						img: require("@/assets/game_pics/pix_sustech1.png"),
						name: "像素南科",
						status: 1
					},
					{
						img: require("@/assets/game_pics/pix_sustech1.png"),
						name: "你科荣耀",
						status: 0
					},
					{
						img: require("@/assets/game_pics/pix_sustech1.png"),
						name: "赛博你科",
						status: 0
					}
				],
				add_game: false,
				add_game_direction: 'rtl',
				new_game_name: '',
				new_game_intro: '',
				new_game_pics: [],
				new_game_ver: '',
				new_game_price: '',
				
				set_game: false,
				set_game_direction: 'rtl',
				set_game_name: '',
				set_game_intro: '',
				set_game_pics: [],
				set_game_ver: '',
				set_game_price: '',
				set_game_isdiscount: "0",
				set_game_isdis: true,
				set_game_discount: '',
				discount_begin: '',
				discount_end: '',
				
				game_detail: false,
				game_detail_direction: 'ltr',
				game_detail_name: '',
				game_detail_ID: '',
				game_detail_condition: '',
				game_detail_version: '',
				game_detail_date: '',
				game_detail_price: '',
				game_detail_num_buy: '',
				game_detail_num_down: ''
			};
		},
		methods: {
			isdiscount(set_game_isdiscount){
				if(set_game_isdiscount == "0"){
					this.set_game_isdis = true
				}else{
					this.set_game_isdis = false
				}
			}
		}
	}
</script>

<style scoped>
</style>
